<div cdkDrag cdkDragHandle
	 cdkDragRootElement=".cdk-overlay-pane"
	 mat-dialog-title>
	<div>
		<h3>Add column for <i>{{ selectedTable.name }}</i></h3>
	</div>
	<button aria-label="close dialog" mat-dialog-close mat-icon-button>
		<span class="material-symbols-outlined notranslate">close</span>
	</button>
</div>

<mat-dialog-content>
	<app-column [form]="form"></app-column>
</mat-dialog-content>

<mat-dialog-actions>
	<button (click)="addColumn()"
			*ngIf="!form.get('old')"
			color="primary"
			mat-stroked-button>
		<span class="material-symbols-outlined notranslate">
			add
		</span>
		Column
	</button>

	<a *ngIf="selectedServer"
	   [href]="selectedServer!.driver.docs.types"
	   mat-button
	   target="_blank">
		<span class="material-symbols-outlined notranslate">
			help
		</span>
		{{ selectedServer.wrapper }} Types
	</a>

	<button (click)="apply()"
			[disabled]="!form.valid"
			cdkFocusInitial
			color="primary"
			mat-flat-button>
		<span class="material-symbols-outlined notranslate">
			view_column_2
		</span>
		Apply
	</button>
</mat-dialog-actions>
